{extend name="base" /}
{block name="body"}
<div class="layui-card">
    <div class="layui-card-header">

    </div>
    <!-- 表格工具栏 -->
    <form class="layui-form toolbar">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">名称:</label>
                <div class="layui-input-inline">
                    <input name="name" class="layui-input" placeholder="" autocomplete="off"/>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">手机:</label>
                <div class="layui-input-inline">
                    <input name="mobile" class="layui-input" placeholder="" autocomplete="off"/>
                </div>
            </div>
            <div class="layui-inline">&emsp;
                <button class="layui-btn icon-btn" lay-filter="ListSearch" lay-submit>
                    <i class="layui-icon">&#xe615;</i>搜索
                </button>
            </div>
        </div>
    </form>

    <table id="tableList" lay-filter="tableList"></table>
    <!-- 表格操作列 -->
    <script type="text/html" id="tableTBTrack">
        {if auth_url('crm/customer/detail')}
        <a href="{:url('crm/customer/detail')}?id={{d.id}}" class="layui-btn layui-btn-sm ajax-detail"><i class="layui-icon">&#xe702;</i>详情</a>
        {/if}
        {if auth_url('crm/customer/edit')}
        <a href="{:url('crm/customer/edit')}?id={{d.id}}" class="layui-btn layui-btn-sm ajax-detail"><i class="layui-icon">&#xe642;</i>修改</a>
        {/if}
        {if auth_url('crm/customer/del')}
        <a href="{:url('crm/customer/del')}?id={{d.id}}" class="layui-btn layui-btn-danger layui-btn-sm ajax-delete"><i class="layui-icon">&#xe640;</i>删除</a>
        {/if}
    </script>
    <!-- 权限列 -->
    <script type="text/html" id="sort_order">
        {if auth_url('crm/customer/edit')}
        <input type="text" name="sort_order" value="{{d.sort_order}}" autocomplete="off" class="layui-input ajax-update" data-url="{:url('crm/customer/edit')}?id={{d.id}}">
        {/if}
    </script>

</div>
{/block}

{block name="js"}
<script>
    layui.use(['layer', 'form', 'table', 'util', 'dropdown'], function () {

        var table = layui.table;
        // 渲染回访表格
        var insTb = table.render({
            elem: '#tableList',
            url: "{:url('crm/customer/index_json')}",
            toolbar: ['<p>',
                {if auth_url('crm/customer/add')}
                '<a href="{:url('crm/customer/add')}" class="layui-btn layui-btn-sm ajax-detail"><i class="layui-icon">&#xe61f;</i>新增客户</a>',
                {/if}
                {if auth_url('crm/customer/transfer')}
                '<button lay-event="transfer" class="layui-btn layui-btn-sm layui-btn-normal"><i class="layui-icon">&#xe609;</i>转移客户</button>',
                {/if}
                {if auth_url('crm/customer/transfer_pool')}
                '<button lay-event="transfer_pool" class="layui-btn layui-btn-sm layui-btn-normal"><i class="layui-icon">&#xe609;</i>转入公海</button>',
                {/if}
                {if auth_url('crm/customer/del')}
                '<button lay-event="del" class="layui-btn layui-btn-sm layui-btn-danger"><i class="layui-icon">&#xe640;</i>批量删除</button>',
                {/if}
                {if auth_url('crm/customer/import')}
                '<a href="{:url('crm/customer/import')}" class="layui-btn layui-btn-sm ajax-detail"><i class="layui-icon">&#xe681;</i>导入客户</a>',
                {/if}
                '</p>'].join(''),
            page: true,
            cellMinWidth: 100,
            limit:'15',
            limits:[15,30,50,100,200,500,1000],
            size:'lg',even:true,
            cols: [[
                {type:'checkbox',title:'#'},
                {foreach name="field" item="r"}
                {if $r.is_status == '1' && $r.is_show == '1' && $r.type =='image'}
                {align: 'center', templet: function (d) {
                        if(d.image){
                            return '<img src="' + d.image + '" class="tdImg" tb-img/>';
                        }else{
                            return '<img src="/static/img/no_image_100x100.jpg" class="tdImg" tb-img/>';
                        }
                    }, title: '{$r.name}', width: 90, unresize: true
                },
                {elseif $r.is_status == '1' && $r.is_show == '1'  && $r.type !='image'}
                {field: '{$r.field}', align: 'left', sort: true, title: '{$r.name}'},
                {/if}
                {/foreach}
                {align: 'center', sort: false, title: '排序',templet:'#sort_order',width:100},
                {
                    field: 'name', title: '客服', align: 'center',width:120, templet: function (d) {
                        return d.user.name
                    }
                },
                {field: 'create_time', align: 'center', sort: true, title: '创建时间'},
                {field: 'update_time', align: 'center', sort: true, title: '最后更新'},
                {align: 'center', toolbar: '#tableTBTrack', title: '操作', minWidth: 260}
            ]],
            parseData: function(res){ //res 即为原始返回的数据
                return {
                  "code": res.code, //解析接口状态
                  "msg": res.msg, //解析提示文本
                  "count": res.data.total, //解析数据长度
                  "data": res.data.data //解析数据列表
                };
            }
        });
        /* 表格搜索 */
        form.on('submit(ListSearch)', function (data) {
            insTb.reload({where: data.field, page: {curr: 1}});
            return false;
        });

        /* 表格头工具栏点击事件 */
        table.on('toolbar(tableList)', function (obj) {
            //console.log(obj)
            if(obj.event === 'transfer') { // 转移
                var checkRows = table.checkStatus('tableList');
                if (checkRows.data.length === 0) {
                    layer.msg('请选择要转移的数据', {icon: 2});
                    return;
                }
                var ids = checkRows.data.map(function (d) {
                    return d.id;
                });
                console.log(ids);
                layer.open({
                    title: '转移数据',
                    type: 2,
                    anim: 0,
                    shadeClose:true,
                    area: ['400px','300px'],
                    content:"{:url('crm/customer/transfer')}?id="+ids,
                    data:{
                        id:ids
                    },
                    success: function(layero, index) {

                    },
                })
            }else if(obj.event === 'del') { // 删除
                var checkRows = table.checkStatus('tableList');
                if (checkRows.data.length === 0) {
                    layer.msg('请选择要删除的数据', {icon: 2});
                    return;
                }
                var ids = checkRows.data.map(function (d) {
                    return d.id;
                });
                layer.confirm('确定批量领取？', {
                    icon: 3,
                    title: '提示'
                }, function (index) {
                    var index = layer.msg('操作中，请稍候', {
                        icon: 16,
                        time: false,
                        shade: 0.3
                    });
                    $.ajax({
                        url: "{:url('crm/customer/del')}",
                        type: 'post',
                        dataType: 'json',
                        data:{
                            id:ids
                        },
                        success: function (result) {
                            layer.msg(result.msg);
                            setTimeout(function () {
                                location.reload();
                            }, 1000);
                        },
                    });
                });
            }else if(obj.event === 'transfer_pool') { // 删除
                var checkRows = table.checkStatus('tableList');
                if (checkRows.data.length === 0) {
                    layer.msg('请选择要转入公海的数据', {icon: 2});
                    return;
                }
                var ids = checkRows.data.map(function (d) {
                    return d.id;
                });
                layer.confirm('确定批量转入公海？', {
                    icon: 3,
                    title: '提示'
                }, function (index) {
                    var index = layer.msg('操作中，请稍候', {
                        icon: 16,
                        time: false,
                        shade: 0.3
                    });
                    $.ajax({
                        url: "{:url('crm/customer/transfer_pool')}",
                        type: 'post',
                        dataType: 'json',
                        data:{
                            id:ids
                        },
                        success: function (result) {
                            layer.msg(result.msg);
                            setTimeout(function () {
                                location.reload();
                            }, 1000);
                        },
                    });
                });
            }
        });

    });

</script>
{/block}